<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
	href="//at.alicdn.com/t/font_388406_5zf3trhujaev1jor.css">
</head>
<body>
<#import "/page.ftl" as page /> 
<style>
	.new-address-table td{
		padding:10px;
		outline: none;
	}
	.new-address-table input{
		border-radius:3px;
	}
	.new-address-table td:NTH-CHILD(odd){
	text-align: right;
	}
</style>
	<link rel="stylesheet" type="text/css" href="/css/public.css">
	<link rel="stylesheet" type="text/css" href="../css/address.css">
	<script type="text/javascript" src="/js/address.js"></script>
	<script>
		$(function(){
			if(${(address.type)!'0'}){
				$(".addaddress-type").val(${(address.type)!''});
			}
			if(${(address.dir.id)!'0'}){
				$(".statustype").val(${(address.dir.id)!''});
			}
		})
	</script>
	<div class="prompt"
		style="display: none; width: 211px; margin: 9% auto;">
		<div style="font-weight: 700; font-size: 14px;">
			<span>你正在写信中,是否离开写信页面?</span>
		</div>
	</div>
	<div class="contacts-tables" style="display: none;">
		<div class="contacts-tables-div">
			<div style="height: 44px; border-bottom: 1px solid #f2f2f2;">
				<div class="tab-tool"
					style="margin-right: 10px; line-height: 28px; margin-top: 7px;">
					<input name="search" class="search-btn-shareuser-input" type="text"
						placeholder="查找..."> <a
						class="search-btn search-btn-shareuser"> <i
						class="iconfont icon-search" style="font-size: 16px;"></i>
					</a>
				</div>
			</div>
			<div class="tab-content">
				<div>
				<table style="width: 100%; border-collapse: collapse; background: #fff;">
					<thead>
						<th>选择</th>
						<th>头像</th>
						<th>部门</th>
						<th>姓名</th>
						<th>职位</th>
						<th>电话</th>
					</thead>
					<tbody>
					<#list (userlist.content) as user>
						<tr style="border-bottom: 1px solid #f2f2f2">
							<td><div  data="${user.id}" name="${user.realName}" onclick='select(this)' class="icheckbox icheckbox_flat-green"
									aria-checked=false style="position: relative;">
									<input type="checkbox"
										style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;">
									<ins class="iCheck-helper"
										style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins>
								</div></td>
							<td><img src='/file/image/${user.photo}'
								style="border-radius: 50%; width: 25px; height: 25px; vertical-align: middle;" /></td>
							<td>${user.dept.name}</td>
							<td>${user.realName}</td>
							<td>${user.deptOffice.name}</td>
							<td>${user.tel}</td>
						</tr>
						</#list>
					</tbody>
				</table>
				<@page.page url=requestURI pager=userlist />
				</div>
			</div>
		</div>
	</div>
	<!-- body大盒子div开始 -->
	<div class="body">
		<!-- content-header顶部div 开始 -->
		<#include "/head.ftl">
		<!-- 中部content div开始 -->
		<div class="content">
			<!-- 中部content内容 div开始 -->
			<div class="row">
			<div class="row-left">
					<a href="/address/addAddress" title="新建联系人"
						class="btn btn-upload bgColor-green2 margin-bottom button"
						style="margin: 0 0 20px 0"> <i
						class="iconfont icon-brush_fill" style="color: white;"></i> 新建联系人
					</a>
					<div class="box box-solid">
						<div class="box-header with-border">
							<h3 class="box-title">文件夹</h3>
							<div class="box-tools">
								<button class="btn btn-box-tool jian" onclick="jian()">
									<i class="iconfont icon-jian" id="one"></i>
								</button>
							</div>
						</div>
						<div class="box-body no-padding yunpan" style="display: block;max-height: 183px;overflow-y: auto;">
							<ul class="nav nav-pills nav-stacked type-ul">
								<li><a href="recently"> 
									<i class="iconfont icon-time-back"></i> 
									<span>最近</span>
								</a></li>
								<#list dirlist as dir>
									<li><a class="address-type" dirid="${dir.id}"> 
										<i class="iconfont icon-circle1"></i> 
										<span>${dir.name}</span>
									</a>
									<a class='dir-btn-delete' dirid="${dir.id}" style='margin-left: 28px;display: none;color:#a29d9d'>
									<i class='iconfont icon-trash'></i>
									</a>
									</li>
								</#list>
							</ul>
						</div>				
					</div>
					<div class="box box-solid">
						<div class="box-header with-border">
							<h3 class="box-title">分类</h3>
						</div>
						<div class="box-body no-padding" style="display: block;">
							<div style="padding:10px">
								<div class="tab-tool" style="float:none">
									<input class="search-input new-type-input" style="width: 86%" type="text" placeholder="类型名称...">
									<div style="display: inline-block;"><a class="new-type" style="background-color: #c65f4a; margin-left: -5px;"> 
										<i class="iconfont icon-jia" style="font-size:14px;color: white;"></i>
										</a>
									</div>
								</div>
							</div>
						</div>
						
					</div>
					<div class="box box-solid">
						<div class="box-header with-border">
							<h3 class="box-title">类型</h3>
							<div class="box-tools">
								<button class="btn btn-box-tool" onclick="jian2()">
									<i class=" iconfont icon-jian " id="two"></i>
								</button>
							</div>
						</div>
						<div class="box-body no-padding leixing" style="display: block;">
							<ul class="nav nav-pills nav-stacked address-status">
								<#list status['address'] as addre>
									<li class="address-menu" status="${addre.value}">
									<a> <i class="iconfont icon-circle1 "></i>${addre.name}
									</a></li>
								</#list>			
							</ul>
						</div>
					</div>
				</div>
				<!-- 右部div盒子开始 -->
			
				<div class="row-right">
					<div class="box tab" style="padding: 10px;">
						
							<form id="addressForm" enctype="multipart/form-data" action="/address/keepaddress" method="post">
						 <div class="box-body no-padding">
							<div class="morediv">
							
							</div>
							<div class="new-address-table" style="margin: 30px;">
							<fieldset style="border-color:rgba(183, 33, 1, 0.7);text-align: center; ">
							<legend>联系人信息</legend>
							<table style="margin:27px auto">
										<tr>
										<td>目录:</td>
										<td>
										<select class="form-control select2 statustype" name="dir">
										<#list dirlist as dir>
											<option value="${dir.id}">${dir.name}</option>
										</#list>
										</select>	
										</td>
										<td>类型:</td>
										<td>
										<select class="form-control select2  addaddress-type" name="type">
										<#list status['address'] as status>
											<#if status.value!=3 && status.value!=4>
												<option value="${status.value}">${status.name}</option>
											</#if>
										</#list>
										</select>
										</td>
										<td rowspan="3">
											<div class="img-div" style=" overflow:hidden;border:none;cursor:pointer;height:160px">
											<#if address?? && address.photo??>
												 <img id="head" src=/file/image/${address.photo} style="width:136px;height:160px;border: 2px solid #cfcfcf"/>
											<#else>
												 <img id="head" style="width:136px;height:160px;border: 2px solid #cfcfcf"/>
											</#if>
											</div>
											<input style="display: none" type="file" name="file" class="file-input" onchange="showPic(this)"/>
										</td>
										</tr>
										
										<#if address??&&address.type==2>
											<tr class="share-td" style="visibility: visible;">
											<td>分享:</td>
											<td colspan="3">
											<div class="form-group" style="position: relative;">
													<input type="text" class="form-control getmain-user" readonly="readonly" style="padding: 0px;"
														placeholder="分享人姓名....." value="${(username)!''}"> 
													<div style="position: absolute; top: 5px; right: 5px;">
																<a href="javascript:void(0)" class="fancybox "> <span
															class="label label-success uniquebackground"> <i
														class="iconfont icon-jia " style="color: white;font-size: 14px;"></i>
													</span>
													</a>
												</div>
											</div>
											</td>
											</tr>
										<#else>
											<tr class="share-td" style="display: none">
											<td>分享:</td>
											<td colspan="3">
											<div class="form-group" style="position: relative;">
													<input type="text" class="form-control getmain-user" readonly="readonly" style="padding: 0px;"
														placeholder="分享人姓名....." > 
												
													<div style="position: absolute; top: 5px; right: 5px;">
																<a href="javascript:void(0)" class="fancybox "> <span
															class="label label-success uniquebackground"> <i
														class="iconfont icon-jia " style="color: white;font-size: 14px;"></i>
													</span>
													</a>
												</div>
											</div>
											</td>
											</tr>
										</#if>
										<input type="hidden" class="userid-input" name="shareuser" value="${(userid)!''}"/>
										<tr>
											<td>姓名:</td>
											<td><input type="text" name="username" value="${(address.username)!''}"/></td>
											<td>手机号码:</td>
											<td><input type="text" name="tel" value="${(address.tel)!''}"/></td>
										</tr>
										<tr>
											<td>性别:</td>
											<td style="text-align: left;">
											<#if address?? && address.sex==1>
												<input type="radio" name="sex" value="1" style="margin: 0 10px" checked="checked">男
												<input type="radio" name="sex" value="0" style="margin: 0 10px">女
												<#elseif address?? && address.sex==0>
												<input type="radio" name="sex" value="1" style="margin: 0 10px" >男
												<input type="radio" name="sex" value="0" style="margin: 0 10px" checked="checked">女
												<#else>
												<input type="radio" name="sex" value="1" style="margin: 0 10px" checked="checked">男
												<input type="radio" name="sex" value="0" style="margin: 0 10px">女
											</#if>	
											</td>
										</tr>
										<tr>
											<td>传真:</td>
											<td colspan="4"><input type="text"style="width: 100%" name="fax" value="${(address.fax)!''}"/></td>
										</tr>
										<tr>
											<td >Email:</td>
											<td colspan="4"><input type="text" style="width: 100%" name="email" value="${(address.email)!''}"/></td>
										</tr>
										<tr>
											<td>地址:</td>
											<td colspan="4"><input type="text" style="width: 100%" name="addr" value="${(address.addr)!''}"/></td>
										</tr>
										<tr>
											<td>备注:</td>
											<td colspan="4"><input type="text" style="width: 100%" name="remark" value="${(address.remark)!''}"/></td>
										</tr>
									</table>
									</fieldset>
							</div>
							<div class="box-footer no-padding"
								style="padding: 14px 0px 10px 0px; border-top: 1px solid #f2f2f2;text-align: center;">
								<div style="margin-top: 5px; display: inline-block;">
									<a href="javascript:void(0)" style="margin-right:15px" class="address-btn-cancel  mail-btn btn-default"> <i
										class="iconfont icon-remove"></i> 取消
									</a> <a  type="发送" class="mail-btn-send address-save  btn-primary uniquebackground" style="color: white">
										<i class="iconfont icon-mail" style="color: white;"></i> 保存
									</a>
								</div>
							</div>
							<input type="hidden" name="photo" value="${(address.photo)!''}">
							<input type="hidden" name="id" value="${(address.id)!''}">
						</form>
					</div>
					<!-- 右部div盒子开始 -->
				</div>
			</div>

			<!-- 中部content div结束-->
		</div>
	
		<!-- body大盒子div结束 -->
	</div>
</body>
</html>